<template>
	<!--评价-->
	<j-modal :title="title" :width="width" :visible="visible" switchFullscreen @ok="handleOk"
		:okButtonProps="{ class:{'jee-hidden': disableSubmit} }"
		:cancelButtonProps="{ class:{'jee-hidden': disableSubmit} }" @cancel="handleCancel" cancelText="关闭" okText="提交">
		<!--表单-->
		<a-spin :spinning="confirmLoading">
			<j-form-container class="scroll-view" style="height: 600px">
				<a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
					<a-row>
						<a-col :span="24">
							<a-form-model-item label="评价内容" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="content"
								style="margin-bottom: 10px;">
								<textarea v-model="model.content" cols="100" rows="3"
									style="width: 100%;padding: 10px;line-height: 25px;" maxlength="200"
									placeholder="请输入评价内容" placeholder-type="color:#999"></textarea>
							</a-form-model-item>
						</a-col>
					</a-row>
					<a-row>
						<a-col :span="24">
							<a-form-model-item label="分类内容" :labelCol="labelCol" :wrapperCol="wrapperCol"
								prop="scoreConfigurationeName" style="margin-bottom: 10px;">
								<a-select :disabled="disabled" placeholder="请选择分类内容"
									:value="model.scoreConfigurationeName"
									@change="handleChange('scoreConfiguratione',$event)">
									<a-select-option v-for="(item,index) in scoreList" :key="index" :value="item">
										{{item.label}}
									</a-select-option>
								</a-select>
							</a-form-model-item>
						</a-col>
					</a-row>
					<a-row>
						<a-col :span="24">
							<a-form-model-item label="上传凭据" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="imgUrl"
								style="margin-bottom: 10px;">
								<j-upload v-model="model.imgUrl" fileType="image" :disabled="disabled"
									:buttonVisible="!disabled" text="上传图片"></j-upload>
							</a-form-model-item>
						</a-col>
					</a-row>

				</a-form-model>
			</j-form-container>
		</a-spin>
		<template #footer>
			<a-button key="back"  @click="handleCancel">取消</a-button>
			<a-popconfirm title="确定提交吗？" @confirm="handleOk">
				<a-button key="submit" type="primary">提交</a-button>
			</a-popconfirm>
		</template>
	</j-modal>
</template>

<script>
	import {
		httpAction,
		getAction,
		postAction
	} from '@/api/manage'
	export default {
		name: 'WtDevicetypeModal',
		components: {

		},
		props: {
			pageType: {
				type: String,
				default: ''
			}
		},
		data() {
			return {
				title: '',
				width: 800,
				visible: false,
				disableSubmit: false,
				disabled: false,
				//表单
				confirmLoading: false,
				labelCol: {
					xs: {
						span: 24
					},
					sm: {
						span: 5
					}
				},
				wrapperCol: {
					xs: {
						span: 24
					},
					sm: {
						span: 16
					}
				},
				labelCol2: {
					xs: {
						span: 24
					},
					sm: {
						span: 2
					}
				},
				wrapperCol2: {
					xs: {
						span: 24
					},
					sm: {
						span: 22
					}
				},
				validatorRules: {},
				model: {
					rateeId: '',
					rateeType: '',
					content: '',
					valuatorType: '',
					scoreConfigurationeName: '',
					scoreConfigurationeId: '',
					imgUrl: '',
					score: '',
				},
				url: {
					add: '/score/wtScoreRecordDetail/add',
					edit: '',
					list: '',
					detail: '',
					delete: '',
				},
				scoreList: [],
			}
		},
		created() {
			this.Dict();
			this.validatorRules = {
				content: [{
					required: true,
					message: '评价内容不能为空,请输入~',
					trigger: 'blur'
				}],
				scoreConfigurationeName: [{
					required: true,
					message: '分类内容不能为空,请选择~',
					trigger: 'change'
				}],
				imgUrl: [{
					required: true,
					message: '上传凭据不能为空,请上传~',
					trigger: 'blur'
				}],
			}
		},
		methods: {
			//下拉选择
			handleChange(type, item, index) {
				console.log(1, type, item, index);
				let _self = this;
				if (type === 'scoreConfiguratione') {
					this.model.scoreConfigurationeName = item.label;
					this.model.scoreConfigurationeId = item.value;
					this.model.score = item.score;
				}
				this.$forceUpdate();
			},
			//获取数据字典列表
			Dict() {
				var _self = this;
				this.scoreList = [];
				//运维评分记录
				getAction(`/score/wtScoreConfiguration/querylist?status=1&type=1`).then((res) => {
					if (res.success) {
						this.scoreList = res.result.map((v) => ({
							...v,
							value: v.id,
							label: v.name
						}));
						this.$forceUpdate();
					}
				})
			},
			add() {
				this.visible = true;
			},
			edit(record) {
				console.log(11, record)
				this.visible = true;
				this.model.rateeId = record.supplierId;
			},
			close() {
				this.$emit('close');
				this.visible = false;
			},
			init() {
				this.model = {
					rateeId: '',
					rateeType: '',
					content: '',
					valuatorType: '',
					scoreConfigurationeName: '',
					scoreConfigurationeId: '',
					imgUrl: '',
					score: '',
				}
			},
			handleOk() {
				const _self = this;
				if (!this.model.content) {
					_self.$message.warning('评价内容不能为空,请输入~');
					return;
				}
				if (!this.model.scoreConfigurationeName) {
					_self.$message.warning('分类内容不能为空,请选择~');
					return;
				}
				if (!this.model.imgUrl) {
					_self.$message.warning('上传凭据不能为空,请上传~');
					return;
				}
				let params = this.model;
				let httpurl = '';
				if (_self.pageType === 'supplier') {
					params.rateeType = '1';
				} else if (_self.pageType === 'team') {
					params.rateeType = '2';
				}
				httpurl = _self.url.add;
				params.valuatorType = '2';

				// 触发表单验证
				_self.confirmLoading = true;
				console.log('提交表单', params)
				// debugger
				httpAction(httpurl, params, 'POST')
					.then((res) => {
						if (res.success) {
							_self.$message.success(res.message);
							_self.close();
							_self.init();
							_self.$emit('ok');
						} else {
							_self.$message.warning(res.message)
						}
					})
					.finally(() => {
						_self.confirmLoading = false
					})
			},
			submitCallback() {
				this.$emit('ok');
				this.visible = false;
			},
			handleCancel() {
				this.close()
			}
		}
	}
</script>
<style scoped>
	.scroll-view {
		overflow: auto;
		overflow-y: scroll;
	}
</style>